<!--A Design by W3layouts
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE HTML>
<html>
<head>
<title>Energy a Industrial Category Flat Bootstarp Responsive Website Template | Team :: w3layouts</title>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<!-- jQuery (necessary JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Custom Theme files -->
<link href="css/style.css" rel='stylesheet' type='text/css' />
<!-- Custom Theme files -->
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Energy Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href='http://fonts.googleapis.com/css?family=Montserrat|Raleway:400,200,300,500,600,700,800,900,100' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Iceland' rel='stylesheet' type='text/css'>  
<!--/animated-css-->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<!--/script-->
<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
					$('html,body').animate({scrollTop:$(this.hash).offset().top},900);
				});
			});
</script>
<!--script-->
</head>
<body>
<!-- banner -->
<div class="banner banner2">
	 <div class="container">
		 <div class="header">
				<div class="col-md-4 head-logo">
				 	<h1><a href="index.html"><img src="images/engry.png" alt=""/>ENERGY</a></h1>
				</div>
				<div class="col-md-4 search">					
				    <form>
					<input type="text" value="" placeholder="Search...">
					<input type="submit" value="">
					</form>					
				</div>
				<div class="col-md-4 social">
				   <ul>
						<li><a href="#"><i class="facebook"></i></a></li>
						<li><a href="#"><i class="twitter"></i></a></li>
						<li><a href="#"><i class="dribble"></i></a></li>	
						<li><a href="#"><i class="google"></i></a></li>										
				  </ul>
				</div>
				<div class="clearfix"> </div>
		 </div>
		 <div class="top-menu">
			 <span class="menu"><img src="images/nav-icon.png"></span>
			 <ul class="menu2">
					 <li><a href="index.html">Home</a></li>
					 <li><a href="index.html">About</a></li>	
					 <li><a href="index.html">Service</a></li>
					 <li><a href="projects.html">Projects</a></li>					 
					 <li><a href="news.html">News & Events</a></li>	
                     <li class="active"><a href="team.html">Team</a></li>							 
					 <li><a href="contact.html">Contact</a></li>					 
						<div class="clearfix"></div>
				 </ul>
				 <!-- script-for-menu -->
		 <script>					
					$("span.menu").click(function(){
						$(".top-menu ul").slideToggle("slow" , function(){
						});
					});
		 </script>
		 <!-- script-for-menu -->	
		 </div>
	 </div>	 
</div>
<!---->	
<div class="team">
	 <div class="container">
		 <div class="team_head">
		 <h2>Our Team</h2>
		 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod 
		 tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, 
		 quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. </p>
		 </div>
		 <div class="team-sec">
		 <div class="col-md-8 team-grid text-center">										 
					  <h3>Team Members</h3>
					  <p>Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum.</p>
					  <ul id="flexiselDemo3">
						<li>
							<div class="biseller-column teams">
							<img src="images/t1.jpg" alt=""/>	
							<h4>John Andy</h4>
							</div>
						</li>
						<li>
							<div class="biseller-column teams">
							<img src="images/t2.jpg" alt=""/>	
							<h4>Steffy</h4>						
							</div>
						</li>
						<li>
							<div class="biseller-column teams">
							<img src="images/t3.jpg" alt=""/>	
							<h4>Diana</h4>							
							</div>
						</li>
						<li>
							<div class="biseller-column teams">
							<img src="images/t4.jpg" alt=""/>	
							<h4>John Kramer</h4>						
							</div>
						</li>
						<li>
							<div class="biseller-column teams">
							<img src="images/t2.jpg" alt=""/>	
							<h4>Steffy</h4>							
							</div>
						</li>						
			     	   </ul>
		 </div>			 		 
				<script type="text/javascript">
				 $(window).load(function() {
					$("#flexiselDemo3").flexisel({
						visibleItems: 3,
						animationSpeed: 1000,
						autoPlay: true,
						autoPlaySpeed: 3000,    		
						pauseOnHover: true,
						enableResponsiveBreakpoints: true,
				    	responsiveBreakpoints: { 
				    		portrait: { 
				    			changePoint:480,
				    			visibleItems: 1
				    		}, 
				    		landscape: { 
				    			changePoint:640,
				    			visibleItems: 2
				    		},
				    		tablet: { 
				    			changePoint:768,
				    			visibleItems: 3
				    		},
							ipad2: { 
				    			changePoint:768,
				    			visibleItems: 3
				    		}
				    	}
				    });
				    
				});
			   </script>			
			   <script type="text/javascript" src="js/jquery.flexisel.js"></script>
			 
		 <div class="col-md-4 t_list">
				  <div class="team-sidebar">
						<h3>Team Members List</h3>
					   <ul>
						  <li><a href="#"><span> </span>Lorem ipsum dolor sit amet</a></li>
						  <li><a href="#"><span> </span>Conse ctetur adipisicing</a></li>
						  <li><a href="#"><span> </span>Elit sed do eiusmod tempor</a></li>
						  <li><a href="#"><span> </span>Incididunt ut labore</a></li>
						  <li><a href="#"><span> </span>Et dolore magna aliqua</a></li>
						  <li><a href="#"><span> </span>Ut enim ad minim veniam</a></li>
					  </ul>							  
				 </div>						
		 </div>		 
			<div class="clearfix"></div>
		 </div>
		 <div class="history">
			  <h3>Our History</h3>
			  <div class="history_grids">
				 <div class="list-grid">
					 <div class="list-year"><h4>2010</h4></div>
					 <div class="histry_info">
						 <h5>Cras imperdiet dolor consectetur ante feugiat, vel aliquet lorem blandit.</h5>
						 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris.
						 Quisque non nisi mauris. Pellentesque facilisis dolor euismod, pretium ligula ut, interdum massa. Suspendisse felis nunc, tristique at justo eget, gravida rutrum ante. Aliquam ultrices feugiat euismod
						 . Pellentesque volutpat fringilla cursus. Etiam aliquet laoreet ante vitae blandit.</p>
					 </div>
					 <div class="clearfix"></div>
				 </div>
				 <div class="list-grid">
					 <div class="list-year"><h4>2007</h4></div>
					 <div class="histry_info">
						 <h5>Integer nec lacus convallis, dapibus sapien lacinia, venenatis augue.</h5>
						 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris.
						 Quisque non nisi mauris. Pellentesque facilisis dolor euismod, pretium ligula ut, interdum massa. Suspendisse felis nunc, tristique at justo eget, gravida rutrum ante. Aliquam ultrices feugiat euismod
						 . Pellentesque volutpat fringilla cursus. Etiam aliquet laoreet ante vitae blandit.</p>
					 </div>
					 <div class="clearfix"></div>
				 </div>
				 <div class="list-grid">
					 <div class="list-year"><h4>2004</h4></div>
					 <div class="histry_info">
						 <h5>Vestibulum imperdiet felis a elit aliquam, non condimentum turpis feugiat.</h5>
						 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris.
						 Quisque non nisi mauris. Pellentesque facilisis dolor euismod, pretium ligula ut, interdum massa. Suspendisse felis nunc, tristique at justo eget, gravida rutrum ante. Aliquam ultrices feugiat euismod
						 . Pellentesque volutpat fringilla cursus. Etiam aliquet laoreet ante vitae blandit.</p>
					 </div>
					 <div class="clearfix"></div>
				 </div>
				 <div class="list-grid">
					 <div class="list-year"><h4>2003</h4></div>
					 <div class="histry_info">
						 <h5>Nam malesuada mi a lacus volutpat, ut dignissim tellus molestie.</h5>
						 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris.
						 Quisque non nisi mauris. Pellentesque facilisis dolor euismod, pretium ligula ut, interdum massa. Suspendisse felis nunc, tristique at justo eget, gravida rutrum ante. Aliquam ultrices feugiat euismod
						 . Pellentesque volutpat fringilla cursus. Etiam aliquet laoreet ante vitae blandit.</p>
					 </div>
					 <div class="clearfix"></div>
				 </div>
			  </div>
		 </div>
	 </div>
</div>
<!---->
<div class="footer1">
	 <div class="container">
		 <div class="ftr1-grids">
				<div class="col-md-4 ftr-grid1">
					 <div class="head-logo logo">
						 <h1><a href="index.html"><img src="images/engry.png" alt=""/>ENERGY</a></h1>
					 </div>
					 <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. 
					 The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters</p>
					 <a class="view" href="#">View ALL ABOUT US <i class="view"></i></a>				 
				</div>
				<div class="col-md-4 frt-grid2">
					 <h3>Latest <span>Tweets</span></h3>
					 <div class="ftr-grid">
						 <p>It is a long established fact that a 
						 reader will be distracted by the of a reader page when at its layout.</p>
						 <a href="#">1 Hour ago</a>
					 </div>
					 <div class="ftr-grid">
						 <p>It is a long established fact that a 
						 reader will be distracted by the of a reader page when at its layout.</p>
						 <a href="#">1 Hour ago</a>
					 </div>
				</div>
				<div class="col-md-4 ftr-grid3">
					 <h3>Subscribe to our <span>Newsletter</span></h3>
					 <form>
						 <input type="text" placeholder="Enter Email here" required/>
						 <input type="submit" value="Subscribe Now"/>
					 </form>
				</div>
				<div class="clearfix"></div>
		 </div>
	 </div>
</div>
<!---->
<div class="copywrite">
		 <div class="container">		 
				 <p>Copyright © 2015 Energy All rights reserved | Design by <a href="http://w3layouts.com" target="_blank">W3layouts</a></p>
		</div>
</div>
<!---->
<!---->
<script type="text/javascript">
		$(document).ready(function() {
				/*
				var defaults = {
				containerID: 'toTop', // fading element id
				containerHoverID: 'toTopHover', // fading element hover id
				scrollSpeed: 1200,
				easingType: 'linear' 
				};
				*/
		$().UItoTop({ easingType: 'easeOutQuart' });
});
</script>
<a href="#to-top" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
<!----> 


</body>
</html>